<!--Start Breadcrumb-->
<script src="../includes/feria_style/js/Validar/validarFeria.js"></script>
<div class="row">
    <div id="breadcrumb" class="col-xs-12">
        
    </div>
</div>
<!--End Breadcrumb-->
<!--Start Dashboard 2-->

<div class="row-fluid">
    

    <div id="dashboard_tabs" class="col-xs-12 col-sm-10">
        <form id="feria" method="post" data-target="flujo/RegistroFeria" action="" class="form">
            <!--Start datos Tab 1-->
            <div id="dashboard-overview" class="row" style="visibility: visible; position: relative;">
                <div class="box">
                    <div class="box-content">
                        <div class="text-left">
                            <h4 class="page-header">Feria </h4>
                        </div>
                        <div class="row ">
                            <div class="col-sm-6">
                                <label class="col-xs-4 control-label form-group" for="dt_fecha">Fecha</label>
                               
                                <div class="col-xs-6 form-group">
                                    <input type="text" class="form-control" id="dt_fecha"  name="dt_fecha" placeholder="" data-toggle="tooltip" title="Fecha de Feria" maxlength="8">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-6 form-group" >
                                <label class="col-xs-4 control-label" for="strsector">Sector</label>
                                <div class="col-xs-8">
                                    <input type="text" class="form-control" id="strsector" name="strsector" placeholder="Ejemplo: 23 Enero " data-toggle="tooltip" title="Sector"/>
                                </div>
                            </div>
                            <div class="col-sm-6 form-group">
                                <label class="col-xs-4 control-label" for="strpunto" >Punto</label>
                                <div class="col-xs-8">
                                    <input type="hidden" id="clvferia" name="clvferia" value=""/>
                                    <input type="text" class="form-control" id="strpunto" name="strpunto" placeholder="Ejemplo: Agua Viva" data-toggle="tooltip" title="Punto"/>
                                </div>
                            </div>
                        </div>
                      
                      
                        <div class="row">
                            <div class="col-sm-6 form-group">
                                <label class="col-xs-4 control-label">Estado</label>
                                <div class="col-xs-8">
                                    <select id="estado" name="ch_estado">
                                        <option value="" selected="true">...</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-sm-6 form-group">
                                <label class="col-xs-4 control-label">Municipio</label>
                                <div class="col-xs-8">
                                    <select id="municipio" name="ch_municipio">
                                        <option value="" selected="true">...</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-6 form-group">
                                <label class="col-xs-4 control-label">Parroquia</label>
                                <div class="col-xs-8">
                                    <select id="parroquia" name="ch_parroquia">
                                        <option value="" selected="true">...</option>
                                    </select>
                                </div>
                            </div>
                            
                        </div>
                         <div class="row">
                            <div class="col-sm-6 form-group">
                                <label class="col-xs-4 control-label">Responsable</label>
                                <div class="col-xs-8">
                                    <select id="responsable" name="ch_responsable">
                                        <option value="" selected="true">...</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-sm-6 form-group">
                                <label class="col-xs-4 control-label">Tipo de Feria</label>
                                <div class="col-xs-8">
                                    <select id="tipo" name="ch_tipo">
                                        <option value="" selected="true">...</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                        
                       <div class="row">
                            <div class="col-sm-8 pull-right">
                                <div class="col-xs-4 text-right pull-right">
                                    <button class="btn btn-danger btn-label-right" id="borrar" type="button">
                                        Eliminar
                                        <span>
                                            <i class="fa fa-arrow-circle-o-right"></i>
                                        </span>
                                    </button>
                                </div>
                                <div class="col-xs-2 pull-right">
                                    <button class="btn btn-primary btn-label-right" id="modificar" type="button">
                                        Actualizar
                                        <span>
                                            <i class="fa fa-arrow-circle-o-right"></i>
                                        </span>
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--End datos Tab 1-->
           
          
        </form>
    </div>

    <div class="clearfix"></div>
</div>

<!--End Dashboard 2 -->

<script type="text/javascript">
    function llenarCampos(){
        $.ajax({
                type: "post",
                url: "../get/buscarFerias",
                dataType: "json",
                cache: false,
                data: {id: '<?php echo $_GET['id'];?>'},
                success: function(data) {
                    if (data['success']) {
                        $.each(data['dato'], function(key, value) {
                           
                            $("#clvferia").val(value['clvferia']);
                            $("#dt_fecha").val(value['datefecha']);
                            $("#strsector").val(value['strlocalidad']);
                            $("#strpunto").val(value['strpunto']);
                            $("#estado").select2("val", value['clvestado']);
                            $("#tipo").select2("val", value['tipoferia']);
                            $("#responsable").select2("val", value['clvresponsable']);
                          
                            //alert(value['clvrol']+value['clvrol']);
                            if ($("#estado").val()) {
                                var id_es = $("#estado").val();
                                $.ajax({
                                    type: "post",
                                    url: "../get/ubicacion",
                                    data: {tip: '2', id: id_es},
                                    success: function(data) {
                                        $("#municipio").html('<option value="" selected="true">...</option>');
                                        $("#municipio").append(data);
                                        $("#municipio").select2("val", value['clvmunicipio']);
                                    }
                                });
                            }
                            $.ajax({
                                type: "post",
                                url: "../get/ubicacion",
                                data: {tip: '3', id: value['clvmunicipio']},
                                success: function(data) {
                                    $("#parroquia").html('<option value="" selected="true">...</option>');
                                    $("#parroquia").append(data);
                                    $("#parroquia").select2("val", value['clvparroquia']);
                                }
                            });


                        });
                    } else {
                        jError('ERROR : ' + data['mensaje'], {
                            VerticalPosition: 'center',
                            HorizontalPosition: 'center'
                        });
                    }

                }
            });
    }
 
// Run Select2 on element
    function Select2Test() {
        $("#parroquia,#municipio,#estado_civil,#estado,#tipo,#responsable").select2();
    }
    $(document).ready(function() {
        // Load script of Select2 and run this
        LoadSelect2Script(Select2Test);
        $('.form-control').tooltip();
     ValidarFeria();
     llenarCampos();
      //fecha
        
        var f = new Date();
        var ano,mes,dia;
        if(f.getMonth()+1<10){
            mes=0+''+(f.getMonth()+1);
            
        }else
            mes=f.getMonth()+1;
        
        if(f.getDate()<10){
            dia=0+''+f.getDate();
            
        }else
            dia=f.getDate();
       
       // var fecha=f.getFullYear()+f.getMonth()+f.getDate();
         $('#dt_fecha').datepicker($.datepicker.regional["es"]).datepicker("option", {
				changeMonth: true,
				changeYear: true,
                                minDate: $.datepicker.parseDate('yymmdd', f.getFullYear()+''+mes+''+dia)

			});
 $("#modificar").click(function() {
       if(!(($('#dt_fecha').val()=='')||($('#strsector').val()=='')||$("#strpunto").val()==''||$("#tipo").val()=='')){
            $.ajax({
                type: "post",
                url: '../flujo/ModificarFeria',
                dataType: "json",
                cache: false,
                data: $("#feria").serialize(),
                success: function(data) {
                    if (data['success']) {
                        jSuccess(data['mensaje'], {
                            VerticalPosition: 'center',
                            HorizontalPosition: 'center'
                        });
                    } else {
                        jError('ERROR : ' + data['mensaje'], {
                            VerticalPosition: 'center',
                            HorizontalPosition: 'center'
                        });
                    }
                }
            });
        }else{
            jError('ERROR : No pueden Existir Campos Vacio', {
                            VerticalPosition: 'center',
                            HorizontalPosition: 'center'
                        });
            }
        });

        $("#borrar").click(function() {
            if( window.confirm("¿Seguro/a de que desea Eliminar la Feria?") ){ 
            var clvferia = $("#clvferia").val();
            $.ajax({
                type: "post",
                url: '../flujo/EliminarFeria',
                dataType: "json",
                cache: false,
                data: {clvferia: clvferia},
                success: function(data) {
                    if (data['success']) {
                        jSuccess(data['mensaje'], {
                            VerticalPosition: 'center',
                            HorizontalPosition: 'center'
                        });

                        var url = 'modificar_feria';
                        window.location.hash = url;

                        LoadAjaxContent('feria/' + url);
                    } else {
                        jError('ERROR : ' + data['mensaje'], {
                            VerticalPosition: 'center',
                            HorizontalPosition: 'center'
                        });
                    }
                }
            });
            }
        });
                        
                                       //listar respon
        $.ajax({
            type: "post",
            url: "../get/ubicacion",
            data: {tip: '7'},
            success: function(data) {
                $("#responsable").append(data);
            }
        });         
                        //listar tipo de Fer
        $.ajax({
            type: "post",
            url: "../get/ubicacion",
            data: {tip: '6'},
            success: function(data) {
                $("#tipo").append(data);
            }
        });
        //listar estados
        $.ajax({
            type: "post",
            url: "../get/ubicacion",
            data: {tip: '1'},
            success: function(data) {
                $("#estado").append(data);
            }
        });
        /* funcion para crear la lista de municipios */
        $("#estado").change(function(event) {
            var id_es = $(this).find(':selected').val();
            $.ajax({
                type: "post",
                url: "../get/ubicacion",
                data: {tip: '2', id: id_es},
                success: function(data) {
                    $("#municipio").html('<option value="" selected="true">...</option>');
                    $("#municipio").append(data);
                }
            });
        });
        /* funcion para crear la lista de Parroquia */
        $("#estado").change(function(event) {
            var id_mu = $(this).find(':selected').val();
            $.ajax({
                type: "post",
                url: "../get/ubicacion",
                data: {tip: '3', id: id_mu},
                success: function(data) {
                    $("#parroquia").html('<option value="" selected="true">...</option>');
                    $("#parroquia").append(data);
                }
            });
        });
        $("#municipio").change(function(event) {
            var id_mu = $(this).find(':selected').val();
            $.ajax({
                type: "post",
                url: "../get/ubicacion",
                data: {tip: '3', id: id_mu},
                success: function(data) {
                    $("#parroquia").html('<option value="" selected="true">...</option>');
                    $("#parroquia").append(data);
                }
            });
        });
        
       
        // Load script of Select2 and run this
        DashboardTabChecker();
        WinMove();
    });
</script>
